跳到主要内容

Enquirer 现代化的交互式命令行工具库

3 分钟阅读

前言

在现代前端开发中,命令行工具 (CLI) 已经成为开发者日常工作中不可或缺的一部分。而如何让CLI工具更加友好、直观,提供良好的用户体验?交互式命令行界面是关键。这里将介绍如何使用Enquirer 来构建交互式命令行。

Enquirer 是一个现代化、直观且用户友好的命令行提示工具库。它提供了简洁的 API 、现代化的界面以及更强大的交互功能。

Github

开始

安装

npm install enquirer 
# or
yarn yarn add enquirer

使用

1.基本选择提示

const { Select } = require("enquirer");

const prompt = new Select({
name: "color",
message: "选择你喜欢的颜色",
choices: ["红色", "黄色", "蓝色"],
});

prompt
.run()
.then((answer) => console.log("你选择了:", answer))
.catch(console.error);

2.多选提示

const { MultiSelect } = require('enquirer');

const prompt = new MultiSelect({
name: 'foods',
message: '选择你喜欢的食物(按空格选择)',
choices: [
{ name: 'pizza', value: '披萨' },
{ name: 'burger', value: '汉堡' },
{ name: 'sushi', value: '寿司' },
{ name: 'noodles', value: '面条' }
]
});

prompt.run()
.then(answers => console.log('你选择了:', answers))
.catch(console.error);

3.输入框提示

const { Input } = require('enquirer');

const prompt = new Input({
name: 'username',
message: '请输入你的用户名'
});

prompt.run()
.then(answer => console.log('用户名:', answer))
.catch(console.error);

4.表单输入

const { Form } = require('enquirer');

const prompt = new Form({
name: 'user',
message: '请填写用户信息',
choices: [
{ name: 'firstName', message: '名' },
{ name: 'lastName', message: '姓' },
{ name: 'email', message: '邮箱' }
]
});

prompt.run()
.then(value => console.log('用户信息:', value))
.catch(console.error);

5.自动补全

const { AutoComplete } = require('enquirer');

const prompt = new AutoComplete({
name: 'flavor',
message: '选择你喜欢的编程语言(输入可过滤)',
limit: 10,
initial: 2,
choices: [
'JavaScript',
'TypeScript',
'Python',
'Java',
'C++',
'C#',
'Go',
'Ruby',
'Swift',
'Kotlin'
]
});

prompt.run()
.then(answer => console.log('你选择了:', answer))
.catch(console.error);

6.自定义验证

const { Input } = require('enquirer');

const prompt = new Input({
name: 'age',
message: '请输入你的年龄',
validate(value) {
if (isNaN(value)) return '请输入数字';
if (value < 18) return '必须年满18岁';
return true;
}
});

prompt.run()
.then(answer => console.log('年龄:', answer))
.catch(console.error);

构建一个 Cli 项目

在这里我们使用 prompt 函数构建:

const { prompt } = require("enquirer");

async function initProject() {
const answers = await prompt([
{
type: "select",
name: "type",
message: "选择框架",
choices: ["Vue", "React"],
},
{
type: "input",
name: "name",
message: "输入项目名称",
validate: (value) => (value.trim() ? true : "项目名称不能为空"),
},
{
type: "confirm",
name: "typescript",
message: "确定要安装吗?",
},
{
type: "multiselect",
name: "features",
message: "选择额外功能(按空格选择)",
choices: [
{ name: "eslint", message: "ESLint代码检查" },
{ name: "prettier", message: "Prettier代码格式化" },
{ name: "tests", message: "单元测试" },
{ name: "ci", message: "CI配置" },
],
},
]);
console.log("\n配置汇总:");
console.log("项目类型:", answers.type);
console.log("项目名称:", answers.name);
console.log("使用TypeScript:", answers.typescript ? "是" : "否");
console.log("额外功能:", answers.features.join(", "));
}

initProject().catch(console.error);
评论
0条评论

添加新评论

昵称
邮箱
网址